<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>设置</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		
		<link href="css/mui.picker.css" rel="stylesheet" />
		<link href="css/mui.poppicker.css" rel="stylesheet" />
		<style type="text/css">
			/*修改首部导航栏文字颜色*/
			.mui-title{
				color: white;
			}
			.back_btn{
				color: white;
			}
			
			.aui-header-bg{
			    background-image:url(themes/img/bg/head_bgimg.jpg);
			    background-position: center;
			    background-repeat: no-repeat;
			    background-size: cover;
			}
			/*小标题样式*/
			 .small_banner{
			 	width: 100%;
			 	height: 40px;
			 	line-height: 40px;
			 	font-size: 14px;
			 	padding-left: 15px;
			 	margin-top: 15px;
			 	background-color: white;
			 	color: #777;
			 }
			 /*资料编辑输入框样式*/
			.inpt_box{
				width: 100%;
				height: auto;
				background-color: white;
			}
	
			.radio_sex > label{
				/*line-height: 45px;
				margin-right: 19%;*/
			}
			.radio_sex span{
				line-height: 45px;
				margin-left: 3%;
				color: #999;
			}
			.radio_sex input[type=radio]{
			    /* right: 40px; */
			    float: left;
			    margin-top: 8PX;
			    display: inline-block;
			    width: 28px;
			    height: 26px;
			    border: 0;
			    outline: 0!important;
			    background-color: transparent;
		    }
		    /*修改表格宽度字体样式*/
		   .mui-input-group .mui-input-row{
		   	height: 45px;
		   }
		   .mui-input-row label{
		   	line-height: 25px;
		   }
		   input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea{
		   	 height: 45px;
		   }
		   /*保存按钮样式*/
		  .save_btn{		  	
		  	margin: 15px auto;
		  	width: 90%;
		  	height: 40px;
		  	line-height: 12px;		  	
		  }
		  /*年级选择下拉框样式*/
		 .nianji_selet{
		 	float: left;
		 	width: 60%;
		 	height: 43px;
		 	/*text-align: center;*/
		 	color: #777;
		 	line-height: 43px;
		 	/*background-color: darkcyan;*/
		 }
		.mui-action-back{
			color: #FFFFFF;
		}
		.mui-checkbox {
			width: 40%;
			float: left;
		}
		.mui-checkbox.mui-left label, .mui-radio.mui-left label{
			padding-left: 38px;
		}
		.mui-checkbox.mui-left input[type=checkbox], .mui-radio.mui-left input[type=radio]{
			left: 0;
			line-height: 44px;
		}
		#phone{
			padding: 0;
		}
		/*优惠券样式*/
		 #coupon{
		 	display: none;
		 }
		
		.coupon_voucher2_main {
			width: 100%;
			height: auto;
		    padding: 10px;    
		    background-color: white;
		}
		.use .coupon_voucher2_view{
			color: #999;
		}
		.coupon_voucher2_view {
		   width: 40%;
		   text-align: center;
		   color: #53c7ca;
		}
		.coupon_voucher2_view p{
			color: #53c7ca;
			margin-bottom: 0;
		}
		.coupon_voucher2_info {
		  width: 60%;
		  /*margin-right: 10%;*/
		  text-align: left;
		  /*background-color: sandybrown;*/
		}
		
		.coupon_voucher2_info_label {
		   margin: 0.6rem 0;
		}
		.coupon_voucher2_info_date {
		   
		}
		.coupon_voucher2_view_price{
			    line-height: normal;
		}
		.coupon_voucher2_view_price i{
		    vertical-align: top;	
		    position: relative;
		    top: 5px;
		    margin: 10px 2px;
		
		    font-style: normal;
		    font-weight: normal;
		}
		.coupon_voucher2_view_price strong{
			font-size: 45px;
		    font-weight: 700;
		}
		/*优惠卷顶部横线*/
		.yhj_topbann{
			 width: 100%;
			 height: 5px;
			 background-color: #999;
			 border-top-left-radius: 5px;
			 border-top-right-radius: 5px;
		}
		/*使用规则样式*/
		.use_rule_div{
			padding: 10px;
			width: 100%;
			/*background-color: salmon;*/
			text-align: right;	
		}
		.use_rule{
		    color: #e93b3d;
		}
		/*未使用颜色*/
		.un_use_color_bg{
			background-color:#53c7ca ;
		}
		.fl{float: left;}
		.fr{float: right;}
		.coupon_voucher2 {
			border: 1px solid #FFFFFF;
		    position: relative;
		    margin: 15px 10px;
		    border-radius: 6px;
		    color: #53c7ca;		    
		    
		    position: relative;
		    -webkit-transition: -webkit-transform .5s ease-in-out;
		    transition: -webkit-transform .5s ease-in-out;
		    transition: transform .5s ease-in-out;
		    transition: transform .5s ease-in-out,-webkit-transform .5s ease-in-out;
		    box-shadow: 0 2px 5px 5px rgba(0,0,0,.1);
		}
		.coupon_voucher2.cur{
			border: 1px solid;
			box-shadow: 0 2px 5px 5px rgba(0,0,0,.1);
		}
		
		.coupon_voucher2_info_label span {
		    display: inline-block;
		    vertical-align: middle;
		    height: 17px;
		    line-height: 17px;
		    font-size: 12px;
		    color: #999;
		    background-color: #f8f8f8;
		    border-radius: 2px;    
		    padding: 0 5px;
		}
		
		.aui-settle-choice span{
			border: none;
		}
		.mod_empty_page_main {
		    margin: 12px 0 8px;
		    font-size: 16px;
		    color: #333;
		}
		.clearfix::after {
		    clear: both;
		    content: ".";
		    display: block;
		    height: 0;
		    visibility: hidden;
		}
		.coupon_voucher2_info ul li{
			font-size: 12px;
			color: #999;
			list-style:disc;
		}
		.coupon_voucher2_info ul li:first-child{
			font-size: 14px;
			
			list-style:none;
			margin-left: -1em;			
			color: #000;
		}
		.layui-layer-page .layui-layer-content{
			overflow:hidden!important;
		}
		</style>
	</head>

	<body>
		
		<header id="header" class="mui-bar mui-bar-nav aui-header-bg">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left back_btn"></a>
			<h1 class="mui-title">资料编辑</h1>
			<!--<a class="mui-btn mui-btn-blue mui-btn-link mui-pull-right" id="bianji">编辑</a>-->
		</header>
		<div class="mui-content">		
			<form id="frmMain">	
				<input type="hidden" id="id" name="id"/>
				<div class="small_banner">
					<span class="mui-icon mui-icon-compose"></span>个人信息
				</div>
				<div class="inpt_box mui-input-group">
					<div class="mui-input-row">
						<label>姓名</label>
						<input type="text" id="name" name="name" placeholder="未填写">
					</div>	
					<div class="mui-input-row ">
						<label>手机</label>
						<div id="btn-phone" class='mui-navigate-right  mui-pull-left' style="width: 65%;">
							<input type="text" id="phone" name="phone" disabled=""  maxlength="11" placeholder="绑定手机号"/>
						</div>
					</div>	
					<div class="mui-input-row">
						<label>年级</label>
						<input type="hidden" id="grade" name="grade"/>
						<div id='showUserPicker' class="nianji_selet">
							<span id="gradeText"></span>
						</div>
					</div>
					<div class="mui-input-row">
						<label>学校</label>
						<input type="text" id="school" name="school" placeholder="未填写">
					</div>
					<div class="mui-input-row">
						<label>班级</label>
						<input type="text" id="classes" name="classes"  placeholder="未填写">
					</div>
					<div class="radio_sex mui-input-row">
						<label for="" class="mui-pull-left">性别</label>
						<div class="mui-clearfix mui-pull-left" style="width: 65%;">
							<div class="mui-checkbox mui-left mui-pull-left">
								<label>男</label>
								<input name="sex" value="1" type="checkbox">
							</div>
							<div class="mui-checkbox mui-left mui-pull-left">
								<label>女</label>
								<input name="sex" value="2" type="checkbox">
							</div>
						</div>
					</div>
				</div>
				<div class="small_banner">
					<span class="mui-icon mui-icon-compose"></span>家长信息
				</div>
				<div class="inpt_box mui-input-group">
					<div class="mui-input-row">
						<label>姓名</label>
						<input type="text" id="parentsName" name="parentsName" placeholder="未填写">
					</div>
					<div class="mui-input-row">
						<label>关系</label>
						<input type="hidden" id="parentsRelation" name="parentsRelation">
						<div id='showRelationPicker' class="nianji_selet mui-navigate-right">
							<span id="relationText">未填写</span>
						</div>
					</div>
					<div class="mui-input-row">
						<label>手机</label>
						<input type="text" maxlength="11" id="parentsPhone" name="parentsPhone" placeholder="未填写">
					</div>
				</div>
				<a type="button" href="javascript:myInfo.submitUser();" class="mui-btn mui-btn-success mui-btn-block save_btn">保存</a>
			</form>
		</div>
		
		<!--发票列表-->
		<div id="coupon">
			
		</div>
		<script src="themes/js/jquery.min.js"></script>	
		<script src="js/mui.js"></script>
		<script src="themes/js/aui.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/mui.picker.js"></script>
		<script src="js/mui.poppicker.js"></script>
		
		<script type="text/javascript" src="themes/js/ajax-util.js"></script>		
		<script type="text/javascript" src="themes/js/Feng.js"></script>
		<script type="text/javascript" src="themes/js/common.js"></script>
		<script type="text/javascript" src="static/my/my_info.js"></script>
		<script type="text/javascript" src="themes/plugin/layer/layer.js"></script>	
		<script type="text/javascript" src="themes/plugin/artTemplate/template.js"></script>	
		<script type="text/javascript" src="static/my/handsel_coupon.js"></script>			
		<script type="text/html" id="couponTempl">
			{{each}}
				<!--内容开始-->
				<div class="aui-coupon-item">
					<div class="coupon_voucher2">
						<div class="yhj_topbann un_use_color_bg"></div>
						<div class="coupon_voucher2_main clearfix"> 
							<div class="coupon_voucher2_view fl">  
								<p class="coupon_voucher2_view_price"><i>¥</i><strong>{{$value.discountAmount}}</strong></p> 
								{{if $value.useCondition === "0"}}
									<p class="coupon_voucher2_view_des">满{{$value.conditionalAmount}}可用</p>
								{{else}}
									<p class="coupon_voucher2_view_des">无门槛用</p>
								{{/if}}
							</div> 
							<div class="coupon_voucher2_info fr">								
								<ul>									
									<li>{{$value.couponName}}</li>
									<li>{{$value.endDate | dateFormat}}到期</li>
								</ul>							
							</div> 
						</div>
					</div>
				</div>
			{{/each}}
		</script>
		
	</body>

</html>